<template>
  <div class="huichuangContainer">
    <!-- banner -->
    <bannerHeader :options="options" class="margin40"> </bannerHeader>
    <!-- 导航 -->
    <nav class="f">
      <p class="title f fb">
        <span class="name">汇创营</span>
        <span class="bod"></span>
      </p>
      <ul class="nav_ul f fl">
        <li
          class="nav_li"
          v-for="(item, index) in navli"
          :key="index"
          :class="{ navAct: navIndex == index }"
          @click="toNav(index)"
        >
          {{ item.title }}
        </li>
      </ul>
    </nav>
    <!-- 内容 -->
    <ul class="cont_ul f">
      <li class="cont_li" v-for="(item, index) in teacherList" :key="index">
        <div class="top newsShow">
          <el-image
            class="photo deimg"
            :src="item.imgUrl ? baseUrl + item.imgUrl : photo"
            fit="fill"
          ></el-image>
          <!--hover效果-->
          <div class="hoverDiv">
            <div class="flexCenter w100 h100 overHidden">
              <div class="w100 m100">
                <p class="desc moreLine">
                  {{ item.about }}
                </p>
              </div>
            </div>
          </div>
        </div>
        <div class="bot f fc">
          <div class="cont">
            <p class="name">郝爱民</p>
            <p class="desc">北京航空航天大学 博士、讲师</p>
          </div>
        </div>
      </li>
    </ul>
  </div>
</template>
<script>
import bannerHeader from "../components/banner";

import { getListWebtutor } from "@/api/api/index";
export default {
  components: {
    bannerHeader,
  },
  data() {
    return {
      options: {
        title: "创造营",
        intro:
          "为您所需提供您所选，打造您专属的办公室，还有多种活动空间，会议室，设备齐全。",
        banner: require("../../static/images/bbi/banner1.jpg"),
      },
      baseUrl: "http://123.57.191.155:8088/tianhui/",
      photo: require("../../static/images/bbi/people.jpg"), // 默认头像
      navIndex: 0,
      navli: [
        { id: 0, title: "创新技术导师" },
        { id: 1, title: "企业家创新导师" },
        { id: 2, title: "创业投资导师" },
        { id: 3, title: "专业服务导师" },
      ],
      teacherList: [
        {
          about:
            "北航能源与动力工程学院，现任副教授、博师生导师。技术领域：缸内直喷汽油机；燃烧与排放；细小颗粒物PM2.5测试与生成机理",
          breedId: "15d6298f1b864b61bbd1ffa43ac0d9ad",
          breedName: "北京北航天汇科技孵化器有限公司",
          id: "1024.0",
          imgUrl:
            "upload/file/web/webwebtutor/1-web-15d6298f1b864b61bbd1ffa43ac0d9ad/webtutor/1603871055577.JPG",
          name: "陈龙飞",
          ownership: "北京航空航天大学",
          position: "副教授、博士生导师",
          qualification: "",
          status: 1,
          typeDict: "1",
          updateDate: "2020-10-28 15:44:19",
          updateUserId: "564420a6a6384bc3b97e01bad05928cc",
          wfSubmit: "false",
        },
        {
          about:
            "北航能源与动力工程学院，现任副教授、博师生导师。技术领域：缸内直喷汽油机；燃烧与排放；细小颗粒物PM2.5测试与生成机理",
          breedId: "15d6298f1b864b61bbd1ffa43ac0d9ad",
          breedName: "北京北航天汇科技孵化器有限公司",
          id: "1024.0",
          imgUrl: "",
          name: "陈龙飞",
          ownership: "北京航空航天大学",
          position: "副教授、博士生导师",
          qualification: "",
          status: 1,
          typeDict: "1",
          updateDate: "2020-10-28 15:44:19",
          updateUserId: "564420a6a6384bc3b97e01bad05928cc",
          wfSubmit: "false",
        },
        {
          about:
            "北航能源与动力工程学院，现任副教授、博师生导师。技术领域：缸内直喷汽油机；燃烧与排放；细小颗粒物PM2.5测试与生成机理",
          breedId: "15d6298f1b864b61bbd1ffa43ac0d9ad",
          breedName: "北京北航天汇科技孵化器有限公司",
          id: "1024.0",
          imgUrl:
            "upload/file/web/webwebtutor/1-web-15d6298f1b864b61bbd1ffa43ac0d9ad/webtutor/1603871628305.JPG",
          name: "陈龙飞",
          ownership: "北京航空航天大学",
          position: "副教授、博士生导师",
          qualification: "",
          status: 1,
          typeDict: "1",
          updateDate: "2020-10-28 15:44:19",
          updateUserId: "564420a6a6384bc3b97e01bad05928cc",
          wfSubmit: "false",
        },
        {
          about:
            "北航能源与动力工程学院，现任副教授、博师生导师。技术领域：缸内直喷汽油机；燃烧与排放；细小颗粒物PM2.5测试与生成机理",
          breedId: "15d6298f1b864b61bbd1ffa43ac0d9ad",
          breedName: "北京北航天汇科技孵化器有限公司",
          id: "1024.0",
          imgUrl:
            "upload/file/web/webwebtutor/1-web-15d6298f1b864b61bbd1ffa43ac0d9ad/webtutor/1603871055577.JPG",
          name: "陈龙飞",
          ownership: "北京航空航天大学",
          position: "副教授、博士生导师",
          qualification: "",
          status: 1,
          typeDict: "1",
          updateDate: "2020-10-28 15:44:19",
          updateUserId: "564420a6a6384bc3b97e01bad05928cc",
          wfSubmit: "false",
        },
        {
          about:
            "北航能源与动力工程学院，现任副教授、博师生导师。技术领域：缸内直喷汽油机；燃烧与排放；细小颗粒物PM2.5测试与生成机理",
          breedId: "15d6298f1b864b61bbd1ffa43ac0d9ad",
          breedName: "北京北航天汇科技孵化器有限公司",
          id: "1024.0",
          imgUrl:
            "upload/file/web/webwebtutor/1-web-15d6298f1b864b61bbd1ffa43ac0d9ad/webtutor/1603871055577.JPG",
          name: "陈龙飞",
          ownership: "北京航空航天大学",
          position: "副教授、博士生导师",
          qualification: "",
          status: 1,
          typeDict: "1",
          updateDate: "2020-10-28 15:44:19",
          updateUserId: "564420a6a6384bc3b97e01bad05928cc",
          wfSubmit: "false",
        },
      ],
    };
  },
  mounted() {
    this.init();
  },
  methods: {
    toNav(index) {
      this.navIndex = index;
    },
    init() {
      getListWebtutor({ typeDict: 1 }).then((res) => {
        console.log(res);
      });
    },
  },
};
</script>
<style lang="scss" scoped>
@import "../assets/css/common.scss";
@import "../assets/css/main.scss";
</style>
